<template>
  <div>
      <!-- <div>当前最新的count：{{$store.state.count}}</div> -->
      <h3>{{$store.getters.showNum}}</h3>
      <button @click="btnHandler1">+1</button>
      <button @click="btnHandler2">+n</button>
      <button @click="btnHandler3">延迟+1</button>
      <button @click="btnHandler4">延迟+5</button>
  </div>
</template>

<script>
export default {
    data(){
        return {}
    },
    methods:{
        btnHandler1(){
            this.$store.commit('add')
        },
        btnHandler2(){
            this.$store.commit('add2', 5)
        },
        btnHandler3(){
            this.$store.dispatch('addSync')
        },
        btnHandler4(){
            this.$store.dispatch('addNSync', 5)
        }
    }
    
}

</script>
<style scoped>
</style>